<template>
  <div>
    <Form
      :schema="schema"
      :model="actor"
      @register="formRegister"
      :isCol="false"
      label-width="240px"
      :rules="actorRules"
    />
    <div v-if="readonly == false" style="text-align: center; margin-top: 10px; width: 100%">
      <el-space>
        <BaseButton type="primary" @click="saveInto">保存</BaseButton>
        <BaseButton @click="initIntoOut">重置</BaseButton>
      </el-space>
    </div>
  </div>
</template>

<script>
import { SpecifyMode } from '@/flow/config/flowConfig'
import { HrItemDic } from '@/config/publicDic'
import * as nodeAuditEmpApi from '@/flow/api/flowNodeAuditEmp'
import { useUserStoreWithOut } from '@/store/modules/user'
import { useForm } from '@/hooks/web/useForm'
import { Form } from '@/components/Form'
const { formRegister, formMethods } = useForm()
export default {
  components: {
    Form
  },
  props: {
    nodeId: {
      type: String,
      default: null
    },
    readonly: {
      type: Boolean,
      default: false
    },
    formId: {
      type: String,
      default: null
    },
    flowId: {
      type: String,
      default: null
    },
    auditType: {
      type: Number,
      default: 0
    },
    nodes: {
      type: Array,
      default: null
    },
    isLoad: {
      type: Boolean,
      default: false
    },
    show: {
      type: String,
      default: null
    }
  },
  data() {
    return {
      HrItemDic,
      SpecifyMode,
      curFormId: null,
      limitMode: [2, 4, 32, 1024],
      schema: [],
      actorRules: {
        Mode: [
          {
            required: true,
            message: '限定范围不能为空！',
            trigger: 'blur'
          }
        ],
        UnitId: [
          {
            required: true,
            message: '限定单位不能为空！',
            trigger: 'blur'
          }
        ],
        DeptId: [
          {
            required: true,
            message: '限定单位不能为空！',
            trigger: 'blur'
          }
        ],
        EmpId: [
          {
            required: true,
            message: '指定人员不能为空！',
            trigger: 'blur'
          }
        ],
        CompanyId: [
          {
            required: true,
            message: '限定公司不能为空！',
            trigger: 'blur'
          }
        ],
        TitleCode: [
          {
            required: true,
            message: '职务不能为空！',
            trigger: 'blur'
          }
        ],
        PostCode: [
          {
            required: true,
            message: '岗位不能为空！',
            trigger: 'blur'
          }
        ],
        ToNodeId: [
          {
            required: true,
            message: '指定节点不能为空！',
            trigger: 'blur'
          }
        ]
      },
      actor: {
        TitleOrPost: 0,
        Mode: 0,
        Range: 0,
        CompanyId: null,
        UnitId: null,
        DeptId: null,
        TitleCode: null,
        PostCode: null,
        EmpId: null,
        TableId: null,
        ColId: null,
        Show: null,
        Keywords: null
      }
    }
  },
  computed: {
    comId() {
      return useUserStoreWithOut().comId
    }
  },
  watch: {
    isLoad: {
      handler(val) {
        if (val) {
          this.intAuditEmp()
        }
      },
      immediate: true
    },
    formId: {
      handler(val) {
        if (val) {
          this.curFormId = [val]
        } else {
          this.curFormId = null
        }
      },
      immediate: true
    }
  },
  mounted() {},
  methods: {
    formRegister,
    initScheme() {
      const list = [
        {
          field: 'Mode',
          label: '限定范围',
          component: 'RadioGroup',
          componentProps: {
            disabled: this.readonly,
            options: SpecifyMode,
            props: {
              label: 'text',
              value: 'value'
            },
            on: {
              change: (val) => {
                this.actor.Mode = val
                this.modeChange(true)
                this.initScheme()
              }
            }
          }
        }
      ]
      if (this.actor.Mode == 128 || this.actor.Mode == 1024) {
        const options = [
          {
            label: '无',
            value: 0
          },
          {
            label: '所在公司',
            value: 2
          },
          {
            label: '所在部门',
            value: 4
          },
          {
            label: '上级部门',
            value: 256
          },
          {
            label: '下级部门',
            value: 512
          },
          {
            label: '所在单位',
            value: 32
          },
          {
            label: '上级单位',
            value: 2048
          },
          {
            label: '下级单位',
            value: 4096
          }
        ]
        list.push({
          field: 'Range',
          label: '行政范围',
          component: 'RadioGroup',
          componentProps: {
            disabled: this.readonly,
            options: this.auditType === 2 ? options.filter((a) => a.value !== 0) : options,
            on: {
              change: (val) => {
                this.actor.Range = val
                this.modeChange(false)
                this.initScheme()
              }
            }
          }
        })
      }
      if (this.actor.Mode == 2 || this.actor.Mode == 4 || this.actor.Mode == 32) {
        list.push({
          field: 'CompanyId',
          label: '限定公司',
          component: 'CompanySelect',
          componentProps: {
            readonly: this.readonly,
            labelField: 'ComName',
            placeholder: '请选择限定公司'
          }
        })
      }
      if (this.actor.Mode == 32) {
        list.push({
          field: 'UnitId',
          label: '限定单位',
          component: 'DeptSelect',
          componentProps: {
            readonly: this.readonly,
            companyId: this.actor.CompanyId,
            isUnit: true,
            isChioseUnit: true,
            placeholder: '限定单位',
            labelField: 'UnitName'
          }
        })
      } else if (this.actor.Mode == 4) {
        list.push({
          field: 'DeptId',
          label: '限定部门',
          component: 'DeptSelect',
          componentProps: {
            readonly: this.readonly,
            companyId: this.actor.CompanyId,
            isChioseUnit: false,
            isUnit: false,
            placeholder: '限定部门',
            labelField: 'DeptName'
          }
        })
      }
      if (
        this.limitMode.includes(this.actor.Mode) ||
        (this.actor.Range !== 0 && this.actor.Mode === 128)
      ) {
        list.push({
          field: 'TitleOrPost',
          label: '职务或岗位',
          component: 'RadioGroup',
          componentProps: {
            disabled: this.readonly,
            options: [
              {
                label: '职务',
                value: 0
              },
              {
                label: '岗位',
                value: 1
              },
              {
                label: '负责人',
                value: 2
              }
            ],
            on: {
              change: (val) => {
                this.actor.TitleOrPost = val
                this.initScheme()
              }
            }
          }
        })
        if (this.actor.TitleOrPost === 0) {
          list.push({
            field: 'TitleCode',
            label: '限定职务',
            component: 'DicItem',
            componentProps: {
              disabled: this.readonly,
              dicId: HrItemDic.title,
              labelField: 'TitleName',
              multiple: true,
              placeholder: '选择职务'
            }
          })
        } else if (this.actor.TitleOrPost === 1) {
          list.push({
            field: 'PostCode',
            label: '限定岗位',
            component: 'TreeDicItem',
            componentProps: {
              readonly: this.readonly,
              dicId: HrItemDic.post,
              labelField: 'PostName',
              multiple: true,
              placeholder: '选择岗位'
            }
          })
        }
      } else if (this.actor.Mode === 16) {
        list.push({
          field: 'TitleCode',
          label: '限定职务',
          component: 'DicItem',
          componentProps: {
            disabled: this.readonly,
            dicId: HrItemDic.title,
            labelField: 'TitleName',
            multiple: true,
            placeholder: '选择职务'
          }
        })
      } else if (this.actor.Mode === 8) {
        list.push({
          field: 'PostCode',
          label: '限定岗位',
          component: 'TreeDicItem',
          componentProps: {
            readonly: this.readonly,
            dicId: HrItemDic.post,
            labelField: 'PostName',
            multiple: true,
            placeholder: '选择岗位'
          }
        })
      } else if (this.actor.Mode === 3) {
        list.push({
          field: 'EmpId',
          label: '指定审批人',
          component: 'EmpInput',
          componentProps: {
            readonly: this.readonly,
            labelField: 'EmpName',
            isMultiple: this.auditType === 2,
            placeholder: '指定审批人'
          }
        })
      } else if (this.actor.Mode === 1) {
        list.push({
          field: 'ColId',
          label: '选择表单字段',
          component: 'FormColChiose',
          componentProps: {
            readonly: this.readonly,
            formId: [this.formId],
            funcType: [1],
            labelField: 'ColName',
            placeholder: '指定审批人',
            on: {
              change: (val, e) => {
                if (e.col) {
                  this.actor.TableId = e.col.TableId
                } else {
                  this.actor.TableId = null
                }
              }
            }
          }
        })
        list.push({
          field: 'Keywords',
          label: '筛选方案名',
          component: 'Input',
          componentProps: {
            readonly: this.readonly,
            clearable: true,
            placeholder: '配合字段使用的筛选方案'
          }
        })
      } else if (this.actor.Mode === 7) {
        list.push({
          field: 'ToNodeId',
          label: '指定节点',
          component: 'Select',
          componentProps: {
            disabled: this.readonly,
            props: {
              value: 'Id',
              label: 'NodeName'
            },
            options: this.nodes,
            clearable: true,
            placeholder: '指定节点'
          }
        })
      }
      this.schema = list
    },
    modeChange(isMode) {
      this.actor.CompanyId = this.comId
      if (isMode) {
        if (this.actor.Mode === 128 || this.actor.Mode === 1024) {
          this.actor.Range = this.auditType === 2 ? 2 : 0
        } else {
          this.actor.Range = 0
        }
      }
      this.actor.UnitId = null
      this.actor.DeptId = null
      this.actor.DeptName = null
      this.actor.UnitName = null
      this.actor.ComName = null
      this.actor.ColName = null
      this.actor.EmpName = null
      this.actor.Keywords = null
      this.actor.TitleOrPost = 0
      this.actor.TitleCode = null
      this.actor.PostCode = null
      this.actor.EmpId = null
      this.actor.ToNodeId = null
      this.actor.TableId = null
      this.actor.ColId = null
      formMethods.setValues(this.actor)
    },
    async saveActor() {
      const data = await formMethods.validate()
      if (data == null) {
        return
      }
      this.setActor(data)
    },
    formatShow(data) {
      const mode = data.Mode
      let show = SpecifyMode.find((a) => a.value === mode).text
      if (mode === 2) {
        show = '限定公司:' + data.ComName
      } else if (mode === 32) {
        show = '限定单位:' + data.UnitName
      } else if (mode === 4) {
        show = '限定部门:' + data.DeptName
      } else if (mode === 1) {
        show = '限定读取表单字段:' + data.ColName
      } else if (mode === 3) {
        show = '限定审批人:' + data.EmpName
      } else if (mode === 7) {
        show = '限定节点审批人:' + this.nodes.find((c) => c.Id === data.ToNodeId).NodeName
      } else if (mode === 16) {
        show = '限定职务:' + data.TitleName
      } else if (mode === 8) {
        show = '限定岗位:' + data.PostName
      }
      if (mode === 128 || mode === 1024) {
        if (data.Range === 256) {
          show = show + '的上级部门'
        } else if (data.Range === 512) {
          show = show + '的下级部门'
        } else if (data.Range === 2048) {
          show = show + '的上级单位'
        } else if (data.Range === 4096) {
          show = show + '的下级单位'
        } else if (data.Range === 4) {
          show = show + '所在部门'
        } else if (data.Range === 32) {
          show = show + '所在单位'
        } else if (data.Range === 2) {
          show = show + '所在公司'
        }
      }
      if (this.limitMode.includes(mode) || (data.Range !== 0 && data.Mode === 128)) {
        if (data.TitleOrPost === 0) {
          show = show + '，职务:' + data.TitleName
        } else if (data.TitleOrPost === 1) {
          show = show + '，岗位:' + data.PostName
        } else {
          show = show + '，负责人'
        }
      }
      return show
    },
    formatActor(val) {
      const data = {
        FlowId: this.flowId,
        NodeId: this.nodeId,
        CompanyId: this.actor.CompanyId,
        TitleCode: val.TitleCode,
        PostCode: val.PostCode,
        DeptId: val.DeptId,
        UnitId: val.UnitId,
        TableId: this.actor.TableId,
        ColId: val.ColId,
        EmpId: val.EmpId,
        ToNodeId: val.ToNodeId,
        Keywords: val.Keywords
      }
      if (data.EmpId != null && !Array.isArray(data.EmpId)) {
        data.EmpId = [data.EmpId]
      }
      let mode = val.Mode
      if (this.limitMode.includes(mode) || (val.Range !== 0 && val.Mode === 128)) {
        if (val.TitleOrPost === 0) {
          mode = mode + 16
        } else if (val.TitleOrPost === 2) {
          mode = mode + 64
        } else {
          mode = mode + 8
        }
      }
      data.SpecifyMode = mode + val.Range
      data.Show = this.formatShow(val)
      return data
    },
    async setActor(val) {
      const data = this.formatActor(val)
      await nodeAuditEmpApi.Set(data)
      this.$message({
        type: 'success',
        message: '保存成功!'
      })
      this.$emit('update:show', data.Show)
      this.$emit('change', data)
    },
    async intAuditEmp() {
      const res = await nodeAuditEmpApi.Get(this.nodeId)
      if (res == null) {
        this.actor.Mode = 0
        this.actor.Range = 0
        this.modeChange()
      } else {
        this.actor.CompanyId = res.CompanyId ? res.CompanyId : this.comId
        this.actor.UnitId = res.UnitId
        this.actor.DeptId = res.DeptId
        this.actor.ToNodeId = res.ToNodeId
        this.actor.TitleCode = res.TitleCode
        this.actor.PostCode = res.PostCode
        this.actor.EmpId = res.EmpId
        this.actor.TableId = res.TableId
        this.actor.ColId = res.ColId
        this.actor.Show = res.Show
        this.actor.Keywords = res.Keywords
        this.actor.Range = 0
        let mode = res.SpecifyMode
        if (mode === 0) {
          this.actor.Mode = 0
        } else if (mode % 2 !== 0) {
          this.actor.Mode = mode
        } else if ((128 & mode) === 128 || (1024 & mode) === 1024) {
          const val = (128 & mode) === 128 ? 128 : 1024
          this.actor.Mode = val
          mode = mode - val
          if ((64 & mode) === 64) {
            this.actor.TitleOrPost = 2
            mode = mode - 64
          } else if ((8 & mode) === 8) {
            this.actor.TitleOrPost = 1
            mode = mode - 8
          } else {
            this.actor.TitleOrPost = 0
            mode = mode - 16
          }
          this.actor.Range = mode
        } else {
          if ((64 & mode) === 64) {
            this.actor.TitleOrPost = 2
            mode = mode - 64
          } else if ((8 & mode) === 8) {
            this.actor.TitleOrPost = 1
            mode = mode - 8
          } else {
            this.actor.TitleOrPost = 0
            mode = mode - 16
          }
          this.actor.Mode = mode
        }
      }
      this.initScheme()
    }
  }
}
</script>
<style scoped>
.el-checkbox-group {
  line-height: 40px;
}
.specifyMode .el-radio {
  line-height: 20px;
  width: 25%;
}
</style>
